<template>
<span>
    <Button v-bind="$attrs" v-on="$listeners" @click="show" :icon="icon" :size="size" :type="type">
        <a v-if="text != '' && type == 'text'">{{text}}</a>
        <span v-else>{{text}}</span>
    </Button>
    <slot></slot>
</span>
</template>

<script>
export default {
    props: {
        formModal: {
            type: Object
        },
        styleType: {
            type: String,
            default: "form",
            validator: function (value) {
                // 这个值必须匹配下列字符串中的一个
                return ['table', 'form'].indexOf(value) !== -1
            }
        },
        data: {
            type: Object
        }
    },
    data() {
        return {
            icon: "",
            text: "",
            size: "",
            type: "default"
        }
    },
    computed: {
        formModalRef: function () {
            if (this.formModal) {
                return this.formModal
            } else if (this.$slots.default) {
                this.$slots.default[0].componentInstance.buttonRelationRef = this.fieldsRef
                return this.$slots.default[0].componentInstance
            }
        },
        fieldsRef: function(){
            if (this.$parent.$parent.$options._componentTag == "ModuleCard" && this.$parent.$parent.$slots.default && this.$parent.$parent.$slots.default[0].componentOptions && (this.$parent.$parent.$slots.default[0].componentOptions.tag == "Fields" || this.$parent.$parent.$slots.default[0].componentOptions.tag == "DataGrid")) {
                return this.$parent.$parent.$slots.default[0].componentInstance
            }
        }
    },
    methods: {
        show() {
            this.formModalRef.show(this.data)
        }
    },
    created() {
        switch (this.styleType) {
            case "table":
                this.icon = ""
                this.size = "small"
                this.text = "编辑"
                // this.type = "default"
                break;

            case "form":
                this.icon = ""
                this.size = "default"
                this.text = "编辑"
                // this.type = "text"
                break;

            default:
                break;
        }
    },
}
</script>

<style lang="less" scoped>

</style>
